<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<c:set var="superLoginName" value="<%=SystemConstant.SYS_SUPER_LOGINNAME%>"/>
<div class="row panel panel-default table-responsive">
    <div class="panel-heading"><span class="fa fa-plus" aria-hidden="true"></span><b>添加用户</b></div>
    <div class="panel-body">
        <div class="row">
            <div class="col-lg-3" style="width: 240px;margin: auto;text-align: center;">
                <div id="headPortraitDiv"><c:if test="${empty user.headPortrait}"><img src="${root}/img/system/photo.jpg" class="img-thumbnail headPortrait" width="100%"></c:if><c:if test="${not empty user.headPortrait}"><img src="${root}/${user.headPortrait}" class="img-thumbnail headPortrait" width="100%"></c:if></div>
                <div style="text-align: left;padding: 10px;margin-left: 68px;"><p>(240*240比例)<p/><button class="btn btn-xs btn-success" id="croppicBtn"><i class="ace-icon fa fa-upload bigger-120"></i>上传头像</button></div>
            </div>
            <form action="${root}/system/user/dosave" class="form-horizontal" method="post" id="saveForm" onsubmit="return doSubmit();">
                <input type="hidden" name="headPortrait" id="headPortrait" value="${user.headPortrait}">
                <input type="hidden" name="orgId" id="orgId" value="${user.orgId}">
                <input type="hidden" name="orgName" id="orgName" value="${user.orgName}">
                <input type="hidden" name="backParam" value="${backParam}">
                <div class="col-lg-9" style="padding-left: 0px;">
                    <div class="form-group">
                        <label for="loginName" class="col-md-2 control-label col-xs-4">登录名称：</label>
                        <div class="col-md-4 col-xs-8">
                            <input type="text" class="form-control" name="loginName" id="loginName" maxlength="20" required placeholder="登录名称" value="${user.loginName}">
                        </div>
                        <label for="realName" class="col-md-2 control-label col-xs-4">真实名称：</label>
                        <div class="col-md-4 col-xs-8">
                            <input type="text" class="form-control" name="realName" id="realName" maxlength="20" required placeholder="真实名称" value="${user.realName}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="age" class="col-md-2 control-label col-xs-4">年龄：</label>
                        <div class="col-md-4 col-xs-8">
                            <input type="number" min="0" max="200" class="form-control" name="age" id="age" value="${user.age}" step="1" maxlength="3" placeholder="年龄" >
                        </div>
                        <label for="gender" class="col-md-2 control-label col-xs-4">性别：</label>
                        <div class="col-md-4 col-xs-8">
                            <label class="radio-inline" style="padding-top: 4px;"><input type="radio" name="gender" id="gender" value="0" <c:if test="${user.gender=='0'||empty user.gender}">checked</c:if>>男</label>
                            <label class="radio-inline" style="padding-top: 4px;margin-left: 23px;"><input type="radio" name="gender" value="1" <c:if test="${user.gender=='1'}">checked</c:if>>女</label>
                        </div>
                    </div>
                    <div class="form-group">
                        
                        <label for="state" class="col-md-2 control-label col-xs-4">状态：</label>
                        <div class="col-md-4 col-xs-8">
                            <label class="radio-inline" style="padding-top: 4px;"><input type="radio" name="state" id="state" value="1" <c:if test="${user.state=='1'||empty user.state}">checked</c:if>>启用</label>
                            <label class="radio-inline" style="padding-top: 4px;"><input type="radio" name="state" value="0" <c:if test="${user.state=='0'}">checked</c:if>>禁用</label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="email" class="col-md-2 control-label col-xs-4">邮箱地址：</label>
                        <div class="col-md-4 col-xs-8">
                            <input type="email" class="form-control" name="email" id="email" maxlength="40" placeholder="邮箱地址" value="${user.email}">
                        </div>
                        <label for="phone" class="col-md-2 control-label col-xs-4">联系电话：</label>
                        <div class="col-md-4 col-xs-8">
                            <input type="text" class="form-control" name="phone" id="phone" maxlength="15" placeholder="联系电话" value="${user.phone}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="idCard" class="col-md-2 control-label col-xs-4">身份证号码：</label>
                        <div class="col-md-10 col-xs-8">
                            <input type="text" class="form-control" name="idCard" id="idCard" maxlength="20" placeholder="身份证号码" value="${user.idCard}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="address" class="col-md-2 control-label col-xs-4">联系地址：</label>
                        <div class="col-md-10 col-xs-8">
                            <input type="tel" class="form-control" name="address" id="address" maxlength="100" placeholder="联系地址" value="${user.address}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="remark" class="col-md-2 control-label col-xs-4">备注信息：</label>
                        <div class="col-md-10 col-xs-8">
                            <input type="tel" class="form-control" name="remark" id="remark" maxlength="125" placeholder="备注信息" value="${user.remark}">
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <button id="submit" class="btn btn-success btn-sm pull-right" type="submit" style="margin-left: 10px;">&nbsp;&nbsp;确&nbsp;&nbsp;定&nbsp;&nbsp;</button>
                    <button class="btn btn-info btn-sm pull-right back" type="button" >&nbsp;&nbsp;返&nbsp;&nbsp;回&nbsp;&nbsp;</button>
                </div>
            </form>
        </div>
    </div>
</div>
<form action="${root}/system/user" method="post" id="backForm">
    <c:forEach items="${paramMap}" var="item">
        <input type="hidden" name="${item.key}" value="${item.value}"/>
    </c:forEach>
</form>

<div id="croppicDiv" style="display: none;width: 240px;height: 240px;"></div>
<script>
    var croppicOptions={
        cropData:{'fileType':'user/headPortrait'},
        imgMaxSize:2,//图片最大2M
        cropUrl: root+'/system/upload/croppic',//裁剪服务器处理路径
        customUploadButtonId: 'croppicBtn',//上传按钮ID
        modal: true,//弹出层
        processInline: true,//在线加载
        rotateControls: false,//旋转
        loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
        onAfterImgCrop:function(data){
            if(data.status==0){
                croppicObj.reset();
                showMes("0",data.msg);
            }else{
                $('#headPortraitDiv img').attr("src",root+data.url);
                $("#headPortrait").val(data.url);
            }
        },
        onError:function(errormessage){
            showMes("0",errormessage);
        }
    }
    var croppicObj = new Croppic('croppicDiv', croppicOptions);
    //选择组织机构
    $('#selOrgId li').click(function(){
        $("#orgId").val($(this).attr('id'));
        $("#orgName").val($(this).find('a').html());
        $("#orgNames").html($(this).find('a').html());
    });
    //返回
    $(".back").click(function () {
        $("#backForm").submit();
    });
    //添加
    function doSubmit(){
       $('#submit').hide();
    }
</script>